<template>
  <div class="content-container">
    <a-row :gutter="16">
      <template-list :list="testData"></template-list>
    </a-row>
    <a-row type="flex" justify="center">
      <a-button type="primary" size="large">加载更多</a-button>
    </a-row>
  </div>
</template>

<script lang="ts" setup>
import { defineComponent, computed } from 'vue';
import { useStore } from 'vuex';
import TemplateList from '../components/TemplateList.vue';
import { GlobalDataProps } from '../store/index';
const store = useStore<GlobalDataProps>();
const testData = computed(() => store.state.templates.data);
</script>

<style scoped>
.page-title {
  color: #fff;
}

.content-container {
  width: 100%;
  max-width: 1200px;
  min-height: 85vh;
  padding: 0 24px 24px 30px;
  margin: 50px auto;
  background: #fff;
}
</style>
